@import '../../../css/colorVar.less';

.isHoliday {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.labelStyle {
  padding-left: 19px;
  margin-bottom: 5px;

  >span {
    display: inline-block;
    border: 1px solid @calendar_label_yellow;
    width: 27px;
    height: 27px;
    border-radius: 4px;
    text-align: center;
    line-height: 27px;
    color: @menu_sel_text;
    background: @calendar_section_yellow_bg;
  }

  >span:first-child {
    border: 1px solid @calendar_section_blue_border;
    margin-right: 10px;
    background: @calendar_section_blue_bg;
  }

  .isGray {
    border: 1px solid @calendar_gray_border  !important;
    background: @calendar_gray_bg  !important;
    color: @text_auxiliary  !important;
  }
}

.product{
  border-color: @product_bg !important;
  .spanColor{
    background-color: @product_bg;
  }
}
.trade{
  border-color: @trade_bg !important;
  .spanColor{
    background-color: @trade_bg;
  }
}
.action{
  border-color: @action_bg !important;
  .spanColor{
    background-color: @action_bg;
  }
}
.register{
  border-color: @register_bg !important;
  .spanColor{
    background-color: @register_bg;
  }
}

:global {
  .myLabel {
    margin-left: 20px;
    font-size: 12px;
    color: @text_main;

    >span:first-child {
      margin-right: 34px;
    }

    >span::before {
      content: '';
      width: 4px;
      height: 4px;
      display: inline-block;
      background: @theme;
      border-radius: 50%;
      position: relative;
      top: -2px;
      right: 6px;
    }

    >span:last-child::before {
      background: @calendar_label_yellow;
    }
  }
}

.Wrap {
  width: 100%;
  overflow: hidden;
  height: 21px;

  :global {
    .box {
      width: 200%;
      height: 21px;
    }

    .marquee-box {
      float: left;
      white-space: nowrap;

      li {
        float: left;
      }
    }
  }
}

.demo {
  overflow: hidden;
  width: 100%;

  :global {
    #indemo {
      float: left;
      width: 800%;
    }

    .demo1 {
      float: left;
    }

    .demo2 {
      float: left;
    }

    .msg,
    .noMsg {
      font-size: 14px;
      line-height: 22px;
      height: 22px;
      font-weight: 600;
      display: inline-block;
    }

    .msg {
      color: @theme;
    }

    .noMsg {
      color: @text_auxiliary;
    }
  }
}

.cardBody {
  margin-bottom: 10px;
  background-color: @section_bg ;
}

.calendarConent {
  :global {
    marquee {
      display: inherit;
      margin: 0 5px;
    }

    .msg,
    .noMsg {
      font-size: 14px;
      line-height: 22px;
      height: 22px;
      font-weight: 600;
    }

    .msg {
      color: @theme;
    }

    .noMsg {
      color: @text_auxiliary;
    }

    ul {
      padding: 0;
      list-style: none;
      margin: 0;
      padding-left: 19px;

      li {
        height: 24px;
        line-height: 24px;
        border-left: 4px solid @calendar_section_blue_border;
        background: @calendar_li_bg;
        margin-right: 20px;
        margin-bottom: 5px;

        span:first-child {
          display: inline-block;
          width: 50%;
          font-size: 14px;
          text-align: center;
          color: @text_secondary;
        }

        span:last-child {
          display: inline-block;
          width: 50%;
          font-size: 14px;
          text-align: center;
          color: @menu_sel_text;
        }
      }
    }
  }
}

.calendarNew {
  background: @main_body_bg;
  height: 100%;

  :global {
    .ant-table-thead>tr>th {
      background-color: @table_header_bg;
      border-bottom: 0;
    }

    .ant-table-tbody>tr>td {
      border-bottom: 0;
      padding-right: 8px!important;
    }

    .ant-table-placeholder {
      background-color: transparent;
    }

    .firstRow {
      display: flex;

      >div:first-child {
        flex: 1;
        margin-right: 10px;
        min-width: 735px;
      }

      >div:last-child {
        width: 341px !important;
        background: @calendar_bg;
        padding: 30px 20px 0px 20px;
      }
    }
  }


  .hidden {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0;
  }

}

.card {
  border-bottom: 1px solid @section_border;
  margin-bottom: 20px;

  :global {

    .dateRow {
      overflow: hidden;
      font-size: 16px;
      color: @text_main;
      line-height: 20px;
      height: 20px;

      span:first-child {
        float: left;
        font-weight: 600;
      }

      span:last-child {
        float: right;
        font-weight: 600;
      }
    }

    .dateRow:nth-child(2) {
      color: @text_auxiliary;
      margin-top: 5px;
      font-size: 14px;
    }

    .dayCenter {
      text-align: center;
      margin-bottom: 7px;
      margin-top: 15px;

      span:first-child {
        font-size: 50px;
        font-weight: 600;
        display: inline-block;
        line-height: 50px;
        height: 50px;
        color: @theme;
      }

      span:last-child {
        margin-left: 19px;
        font-size: 16px;
        color: @text_auxiliary;
      }
    }

    .eventsInfo {
      text-align: right;
      width: 100%;
      cursor: pointer;
      color: @theme;
      margin-bottom: 19px;
    }

  }
}

:global {
  .calendarEvents {
    padding: 25px 4px 8px 4px;

    .ant-row {
      display: flex;
      margin-bottom: 8px;
      line-height: 1.8;

      span:first-child {
        font-size: 14px;
        color: @text_main;
        margin-right: 10px;
        width: 56px;
      }

      span:last-child {
        flex: 1;
        font-size: 14px;
        color: @text_auxiliary;
      }
    }

    .ant-row:last-child {
      margin-bottom: 0;
    }
  }
}

.hide {
  display: none;
}

.cashRemain {
  background-color: @noData-bg;
  border: 1px solid @calendar_border;
  padding: 20px 0;

  :global {
    .cashRow {
      line-height: 25px;

      span:first-child {
        width: 110px;
        display: inline-block;
        text-align: right;
        font-size: 14px;
        color: @text_main;
        margin-right: 5px;
      }
    }
  }
}

.register {
  font-size: 14px;
  color: @text_main;

  :global {
    .tableTitle {
      height: 30px;
      line-height: 30px;
      padding: 0 20px;

      >span:first-child {
        display: inline-block;
        width: 50%;
        margin-right: 20px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }

      >span:last-child {
        display: inline-block;
        width: calc(~"50% - 20px");
        ;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;

      }
    }

    .titleColor {
      background: rgba(35, 102, 255, 0.1) ;

    }

    ul,
    li {
      padding: 0;
      list-style: none;
    }

    ul {
      margin-bottom: 20px;
      border-bottom: 1px solid @table_header_bg;
      overflow: auto;

      // height: 180px;
      li:nth-of-type(even) {
        background: @table_even_bg;
      }
    }

    .noData {
      text-align: center;
      border-bottom: 1px solid @table_header_bg;
      margin-bottom: 11px;
      padding-bottom: 20px;
      padding-top: 12px;

      p {
        padding: 0;
        margin: 0;
        font-size: 12px;
        color: @text_auxiliary;
      }
      img{
        width: 76px;
        height: 52px;
      }
    }



  }
}

.operate {
  width: 88px;
}

:global {

  .register ul {
    height: 90px;
  }

  .register:nth-child(3) ul {
    height: 120px;
    margin-bottom: 11px;

  }

  .register:nth-child(3) .noData {
    height: 120px;
    padding-top: 26px;
  }

}

.eventsTitle {
  position: relative;
  margin-top: 20px;

  >span {
    position: absolute;
    top: 0;
    left: 120px;
    color: @text_main
  }
}

.alignLeft {
  text-align: left !important;
}

.trade {
  :global {

    .ant-table-thead>tr:first-child>th:last-child,
    .ant-table-tbody>tr>td:last-child {
      text-align: left !important;
    }
    td{
      .ant-table-thead>tr:first-child>th:last-child,
      .ant-table-tbody>tr>td:last-child {
        text-align: right !important;
      }
     }
  }
}

